// qiankun动态publicPath配置
import './public-path'

// with polyfills
import 'core-js/stable'
import 'regenerator-runtime/runtime'

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store/'
import i18n from './locales'
import { VueAxios } from './utils/request'
import ProLayout, { PageHeaderWrapper } from '@ant-design-vue/pro-layout'
import themePluginConfig from '../config/themePluginConfig'
import { handleLogout } from './utils/logout'

// mock
// WARNING: `mockjs` NOT SUPPORT `IE` PLEASE DO NOT USE IN `production` ENV.
// import './mock'

import bootstrapStore from './core/bootstrap'
import './core/lazy_use' // use lazy load components
import './permission' // permission control
import './utils/filter' // global filter
import './global.less' // global style
Vue.config.productionTip = false

// mount axios to `Vue.$http` and `this.$http`
Vue.use(VueAxios)
// use pro-layout components
Vue.component('pro-layout', ProLayout)
Vue.component('page-container', PageHeaderWrapper)
Vue.component('page-header-wrapper', PageHeaderWrapper)

window.umi_plugin_ant_themeVar = themePluginConfig.theme

// qiankun子应用配置
let instance = null

function render(props = {}) {
  const { container } = props

  // 在qiankun环境下动态调整主题文件路径
  if (window.__POWERED_BY_QIANKUN__) {
    // 确保主题文件能够正确加载
    const themeLink = document.querySelector('link[href*="theme-colors"]')
    if (themeLink) {
      const href = themeLink.getAttribute('href')
      if (!href.startsWith('/model/')) {
        themeLink.setAttribute('href', `/model/${href}`)
      }
    }
  }

  instance = new Vue({
    router,
    store,
    i18n,
    created: bootstrapStore,
    render: (h) => h(App),
  }).$mount(container ? container.querySelector('#app') : '#app')
}

// 独立运行时
if (!window.__POWERED_BY_QIANKUN__) {
  render()
}

// qiankun生命周期函数
export async function bootstrap() {
  console.log('[vue] vue app bootstraped')
}

export async function mount(props) {
  console.log('[vue] props from main framework', props)
  const { actions } = props
  const { CURRENT_APP_CHANGE, MENU_CHANGE, LANGUAGE_CHANGE, ON_LOGOUT } = actions?.EVENTS_ENUM || {}
  // 隐藏应用列表选择
  actions?.setAppListVisible(false)
  // 监听登录事件
  actions.on(ON_LOGOUT, handleLogout)
  actions.on(MENU_CHANGE, (menu) => {
    console.log('MENU_CHANGE', menu)
    // 通过 Vue 事件总线发送刷新事件
    if (instance) {
      // 或者使用全局事件总线
      instance.$root.$emit('menu-change', menu)
    }
  })
  actions.on(LANGUAGE_CHANGE, (language) => {
    console.log('LANGUAGE_CHANGE', language)
    // 通过 Vue 事件总线发送刷新事件
    if (instance) {
      // 或者使用全局事件总线
      instance.$root.$emit('language-change', language)
    }
  })
  actions.on(CURRENT_APP_CHANGE, (app) => {
    console.log('CURRENT_APP_CHANGE', app)
    // 通过 Vue 事件总线发送刷新事件
    if (instance) {
      // 或者使用全局事件总线
      instance.$root.$emit('app-change', app)
    }
  })
  // 确保Ant Design样式在qiankun环境下正确加载
  if (window.Vue && window.Vue.prototype.$modal) {
    window.Vue.prototype.$modal.config({
      getContainer: () => (props.container ? props.container.querySelector('#app') : document.body),
    })
  }

  render(props)
}

export async function unmount() {
  instance.$destroy()
  instance.$el.innerHTML = ''
  instance = null
}
